<link href="/css/admin/select2.css" rel="stylesheet">
<link href="/css/admin/bootstrap-editable.css" rel="stylesheet">
<style type="text/css">
    .dashboard-wrapper .left-sidebar{
        margin-right:0px;
    }
    .form-actions {
        padding: 19px 20px 20px;
        margin-top: 20px;
        margin-bottom: 20px;
        background-color:#fafafa;
        border-top: 0;
    }
    #Submits input{
        width:500px;
    }
    #Images{
        cursor:pointer;
    }
</style>
<div class="sub-nav">
    <ul>
        <li><a href="" class="heading">信息编辑</a></li>
    </ul>
</div>
<div class="dashboard-wrapper">
    <div class="left-sidebar">
        <div class="row-fluid">
            <div class="span12">
                <div class="widget no-margin">
                    <div class="widget-header">
                        <div class="title">
                            Edit Profile
                        </div>
                        <span class="tools">
                            <a class="fs1" aria-hidden="true" data-icon="&#xe090;"></a>
                        </span>
                    </div>
                    <div class="widget-body">
                        <div class="container-fluid">
                            <form action="/admin/account/edit" method="post" class="form-horizontal" id="Submits" enctype="multipart/form-data">
                                <div class="row-fluid">
                                    <div class="span3">
                                        <div class="thumbnail">
                                            <img alt="300x200" src="<?php echo $data['image'] ? "/upload/image/admin/original/" . $data['image'] : '/img/admin/profile.png'; ?>" id="Images">
                                            <input type="file" id="Files" name="file" style="display:none;" />
                                            <div class="caption">
                                                <input type="text" id="nickname" name="nickname" style="width:270px;" data-type="text" value="<?php echo $data['nickname'] ? $data['nickname'] : '请输入您的昵称 '; ?>"/>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="span9">
                                        <input type="hidden" name="id"  value="<?php echo $data['id']; ?>"/>
                                        <h5>登录信息</h5>
                                        <hr>
                                        <div class="control-group">
                                            <label class="control-label">用户名</label>
                                            <div class="controls">
                                                <input type="text" id="userName" name="username" data-type="text" value="<?php echo $data['username']; ?>"/>
                                            </div>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label">Email</label>
                                            <div class="controls">
                                                <input type="text" id="Emails" name="email" data-type="text" value="<?php echo $data['email']; ?>"/>
                                            </div>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label">密码</label>
                                            <div class="controls">
                                                <input type="password" id="password" name="password" data-type="text" value=""/>
                                            </div>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label">再次密码</label>
                                            <div class="controls">
                                                <input type="password" id="confirmPassword" name="confirmPassword" data-type="text" value=""/>
                                            </div>
                                        </div>
                                        <br />
                                        <h5>个人信息</h5>
                                        <hr>
                                        <div class="control-group">
                                            <label class="control-label">姓氏</label>
                                            <div class="controls">
                                                <input type="text" id="firstName" name="first_name" data-type="text" value="<?php echo $data['last_name']; ?>"/>
                                            </div>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label">名字</label>
                                            <div class="controls">
                                                <input type="text" id="lastName" name="last_name" data-type="text" value="<?php echo $data['first_name']; ?>"/>
                                            </div>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label">地址</label>
                                            <div class="controls">
                                                <input type="text" id="location" name="address" data-type="text" value="<?php echo $data['address']; ?>"/>
                                            </div>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label">个人主页</label>
                                            <div class="controls">
                                                <input type="text" id="url" name="url" data-type="text" value="<?php echo $data['url']; ?>"/>
                                            </div>
                                        </div>
                                        <div class="form-actions">
                                            <button type="submit" class="btn btn-info">保存更改</button>
                                            <button type="button" class="btn">取消</button>
                                        </div>
                                    </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>

<script src="/js/admin/bootstrap-editable.min.js"></script>
<script src="/js/admin/select2.js"></script>
<script type="text/javascript">
    $('#enable').click(function() {
        $('#user .editable').editable('toggleDisabled');
    });
    $('.inputText').editable({
        type: 'text',
        pk: 1,
        name: 'name',
        title: 'Enter Name'
    });
    $('.inputTextArea').editable({
        showbuttons: true
    });
    $('#tags').editable({
        inputclass: 'input-large',
        select2: {
            tags: ['html5', 'javascript', 'Jquery', 'css3', 'ajax', 'Sass', 'Haml', 'Photoshop'],
            tokenSeparators: [",", " "]
        }
    });
    $('#user .editable').on('hidden', function(e, reason) {
        if (reason === 'save' || reason === 'nochange') {
            var $next = $(this).closest('tr').next().find('.editable');
            if ($('#autoopen').is(':checked')) {
                setTimeout(function() {
                    $next.editable('show');
                }, 300);

            } else {
                $next.focus();
            }
        }
    });
    $("#Submits").submit(function() {
        var userName = $.trim($("#userName").val());
        var Emails = $.trim($("#Emails").val());
        var password = $.trim($("#password").val());
        var confirmPassword = $.trim($("#confirmPassword").val());
        var firstName = $.trim($("#firstName").val());
        var lastName = $.trim($("#lastName").val());
        var location = $.trim($("#location").val());
        var url = $.trim($("#url").val());
        if (userName == "Empty" || userName == '') {
            alert("用户名不能为空");
            $("#userName").focus();
            return false;
        }
        var myreg = /^([a-zA-Z0-9_-].*)+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
        if (!myreg.test(Emails)) {
            $("#Emails").focus();
            return false;
        }
        if (password == "") {
            $("#password").focus();
            return false;
        }
        if (password != confirmPassword) {
            $("#confirmPassword").focus();
            return false;
        }
    });
</script>
<script>
    //上传头像
    //模拟弹出
    $("#Images").click(function() {
        $("#Files").click();
    });
    // 选择图片后触发
    $("#Files").change(function() {
        var src = getFileUrl("Files");
        $("#Images").attr("src", src);
    });
    //获取本地图片路径
    function getFileUrl(sourceId) {
        var url;
        if (navigator.userAgent.indexOf("MSIE") >= 1) { // IE
            url = document.getElementById(sourceId).value;
        } else if (navigator.userAgent.indexOf("Firefox") > 0) { // Firefox
            url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
        } else if (navigator.userAgent.indexOf("Chrome") > 0) { // Chrome
            url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
        }
        return url;
    }
</script>